<template>
    <div id='loan-apply-detail'>
       <!--  <h1 class="card-title">
           <span>审核详情</span>
       </h1> -->
        
        <div class="loading-min-height">
            <loading v-show='loading' mode='full'></loading>
            <transition name='fade'>
                <div class="result-info" v-if='!loading'>
                    <div class="detail-info">
                        <p>审核状态: <span>{{info.statusStr || placeholder}}</span></p>
                        <p>专属客服: <span>{{info.operator || placeholder}}</span></p>
                        <p>放款形式: <span>{{ placeholder1}}</span></p>
                        <!-- info.loanLendType || -->
                    </div>
                    <div class="card-content">
                        <div class="sub-title"><span class="title">借款人基本信息</span></div>
                        <ul class="result-info__list">
                            <li class="result-info__item">
                                <div class="result-info__key">借款人姓名</div>
                                <div class="result-info__value">{{basicInfo.name || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">手机号</div>
                                <div class="result-info__value">{{basicInfo.phone || placeholder}}</div>
                            </li>
                            <!-- <li class="result-info__item">
                                <div class="result-info__key">QQ</div>
                                <div class="result-info__value">{{basicInfo.qq || placeholder}}</div>
                            </li> -->
                            <li class="result-info__item">
                                <div class="result-info__key">来源渠道</div>
                                <div class="result-info__value">{{basicInfo.authSource || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">认证时间</div>
                                <div class="result-info__value">{{basicInfo.authCheckTime || placeholder}}</div>
                            </li>
                            <!-- <li class="result-info__item">
                                <div class="result-info__key">认证地址</div>
                                <div class="result-info__value">{{basicInfo.address || placeholder}}</div>
                            </li> -->
                            <li class="result-info__item">
                                <div class="result-info__key">认证设备型号</div>
                                <div class="result-info__value">{{basicInfo.authDeviceModel || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">已成功借款次数</div>
                                <div class="result-info__value">
                                    {{basicInfo.lendTime}}
                                    <span @click='show_modal_lendlist = true' class="green" v-if='basicInfo.lendList && basicInfo.lendList.length'>查看已成功借款记录</span>
                                </div>
                            </li>
                        </ul>
                    </div>

                    <div class="card-content">
                        <div class="sub-title"><span class="title">借款申请基本信息</span></div>
                        <ul class="result-info__list">
                            <li class="result-info__item">
                                <div class="result-info__key">申请时IP</div>
                                <div class="result-info__value">{{loanInfo.loanIp || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">定位地址</div>
                                <div class="result-info__value">{{loanInfo.loanLocate || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">申请时间</div>
                                <div class="result-info__value">{{loanInfo.loanApplyTime || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">申请来源渠道</div>
                                <div class="result-info__value">{{loanInfo.loanSource || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">申请设备</div>
                                <div class="result-info__value">{{loanInfo.loanDeviceModel || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">申请金额</div>
                                <div class="result-info__value">{{loanInfo.applyAmount | toYuan}}元</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">借款周期</div>
                                <div class="result-info__value">{{loanInfo.applyCycle || placeholder}}天</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">逾期罚息</div>
                                <div class="result-info__value">{{loanInfo.overDueCharge | toPercent}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">服务费</div>
                                <div class="result-info__value">{{loanInfo.serviceAmount | toYuan}}元</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">到期应还款</div>
                                <div class="result-info__value">{{loanInfo.needRepayAmount | toYuan}}元</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">收款银行卡</div>
                                <div class="result-info__value">{{loanInfo.cardName || placeholder}}</div>
                            </li>
                        </ul>
                    </div>

                    <div class="card-content" v-if='info.report && info.report.lendInfo'>
                        <div class="sub-title"><span class="title">放款信息</span></div>
                        <ul class="result-info__list">
                            <li class="result-info__item">
                                <div class="result-info__key">放款金额</div>
                                <div class="result-info__value">{{lendInfo.lendAmount | toYuan}}元</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">借款周期</div>
                                <div class="result-info__value">{{lendInfo.lendCycle || placeholder}}天</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">服务费</div>
                                <div class="result-info__value">{{lendInfo.serviceAmount | toYuan}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">到账金额</div>
                                <div class="result-info__value">{{lendInfo.lendRealAmount | toYuan}}元</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">到期应还款</div>
                                <div class="result-info__value">{{lendInfo.lendAmount | toYuan}}元</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">收款银行卡</div>
                                <div class="result-info__value">{{lendInfo.cardName || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">状态</div>
                                <div class="result-info__value">{{lendInfo.lendStatus || placeholder}}</div>
                            </li>
                            <li class="result-info__item">
                                <div class="result-info__key">打款时间</div>
                                <div class="result-info__value">{{lendInfo.lendTime || placeholder}}</div>
                            </li>
                        </ul>
                    </div>

                    <div class="card-content" 
                        v-if='report.hasIcould && type == 1 && info.status == "WAITCHECK" || report.hasIcould && info.status != "WAITCHECK"'>
                    <!-- <div class="card-content"> -->
                        <div class="sub-title">
                            <span class="title">iCloud账号信息</span>
                            <div>
                                <span class="button auto transparent tar" v-if='btnInfo.unbind == 1' @click='show_confirm_unbind = true'>解绑</span>
                                <span class="button auto transparent tar" v-if='btnInfo.unbind == 2'>解绑中</span>
                                <span class="button auto transparent tar" v-if='btnInfo.delayCheckBind'  @click='show_confirm_delay_bind = true'>延迟确认绑定</span>
                            </div>    
                        </div>
                        <template v-if='report.loanType == "operator"'>
                            <ul class="result-info__list">
                                <li class="result-info__item">
                                    <div class="result-info__key">AppleID</div>
                                    <div class="result-info__value">{{icouldInfo.appleId || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">密码</div>
                                    <div class="result-info__value">
                                        {{icouldInfo.applePwd || placeholder}}
                                        <span class='new-pwd green' v-if='info.report.icloudMsgShow' @click='show_modal_icloud = true'> 录入新密码</span>
                                    </div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">出生日期</div>
                                    <div class="result-info__value">{{icouldInfo.bornDay | dateFormat('YYYY-MM-DD')}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">邮箱密码</div>
                                    <div class="result-info__value">{{icouldInfo.emailPwd || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">安全问题1</div>
                                    <div class="result-info__value">{{icouldInfo.firstQuestion || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">答案1</div>
                                    <div class="result-info__value">{{icouldInfo.firstAnswer || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">安全问题2</div>
                                    <div class="result-info__value">{{icouldInfo.secondQuestion || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">答案2</div>
                                    <div class="result-info__value">{{icouldInfo.secondAnswer || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">安全问题3</div>
                                    <div class="result-info__value">{{icouldInfo.thirdQuestion || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">答案3</div>
                                    <div class="result-info__value">{{icouldInfo.thirdAnswer || placeholder}}</div>
                                </li>
                            </ul>
                        </template>
                        <template v-else>
                            <ul class="result-info__list">
                                <li class="result-info__item">
                                    <div class="result-info__key">设备名称</div>
                                    <div class="result-info__value">{{icloudDeviceInfo.name || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">设备型号</div>
                                    <div class="result-info__value">{{icloudDeviceInfo.deviceModel || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">IMEI</div>
                                    <div class="result-info__value">{{icloudDeviceInfo.imei || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">序列号</div>
                                    <div class="result-info__value">{{icloudDeviceInfo.serialNumber || placeholder}}</div>
                                </li>
                                <li class="result-info__item">
                                    <div class="result-info__key">iCloud状态</div>
                                    <div class="result-info__value">{{report.icloudStatusStr || placeholder}}</div>
                                </li>
                            </ul>
                        </template>
                    </div>

                    <div class="card-content" 
                        v-if='!report.hasIcould && type == 1 && report.loanType == "operator" && (!report.hasIcould && info.status == "WAITCHECK")'>
                        <div class="sub-title"><span class="title">iCloud账号信息</span></div>
                        <button-loading :loading='loading_icloud' :mid='true' @click='getIcloud'>获取空闲icloud账号</button-loading>
                    </div>

                    <div class="card-content" v-if='info.status == "WAITCHECK" || records.length'>
                        <div class="sub-title">
                            <span class="title">通讯录信息</span>
                           <!--  <span class="button auto transparent tar" v-if='records.length' @click='reGetContact'>再次获取通讯录</span> -->
                        </div>
                        <button-loading 
                            v-if='contactInfo.hasContact === 0 ' 
                            :loading='loading_contact' 
                            :mid='true' 
                            @click='getContact'>获取通讯录</button-loading>
                        <button-loading 
                            v-if='contactInfo.hasContact === 2 ' 
                            :loading='loading_contact' 
                            :mid='true' 
                            @click='getInfo'>等待用户上传<i class="iconfont icon-refresh"></i></button-loading>
                        <div class='loading-min-height' v-if='contactInfo.hasContact === 1 '>
                            <loading v-show='loading_contact' mode='full'></loading>
                            <p class='no-data' v-if='!loading_contact && !records.length'>暂无数据</p>
                            <div class="table-list" v-if='records.length'>
                                <table>
                                    <thead class="table-list__head">
                                        <tr>
                                            <th>通讯录号码</th>
                                            <th>通讯录名字</th>
                                            <th>通话次数</th>
                                            <th>通话时长</th>
                                            <th>主叫次数</th>
                                            <th>主叫时长</th>
                                            <th>被叫次数</th>
                                            <th>被叫时长</th>
                                        </tr>
                                    </thead>
                                    <tbody class='table-list__body have-border'>
                                        <tr v-for='item in records'>
                                            <td>{{ item.mobile || placeholder }}</td>
                                            <td>{{ item.contactName || placeholder }}</td>
                                            <td>{{ item.talk_count || placeholder }}</td>
                                            <td>{{ item.talk_seconds | secondFormat }}</td>
                                            <td>{{ item.call_count || placeholder }}</td>
                                            <td>{{ item.call_seconds | secondFormat }}</td>
                                            <td>{{ item.called_count || placeholder }}</td>
                                            <td>{{ item.called_seconds | secondFormat }}</td>
                                        </tr>
                                    </tbody>
                                </table>
                                <pagination
                                    :current-page='listInfo.pageNum'
                                    :total-page='listInfo.totalPage'
                                    @pageChange='getContactList'></pagination>
                            </div>
                        </div>
                    </div>
                    

                    <div class="card-content" v-if='info.status == "WAITCHECK" || info.status == "WAITAUTH"'>
                        <div class="sub-title"><span class="title">备注</span></div>
                        <textarea class='modal__textarea' rows="5" placeholder="请输入备注" v-model='remarks'></textarea>
                        <button-loading class='button-add-remarks' :loading='loading_remarks' :mid='true' @click='addRemarks'>提交备注</button-loading>
                    </div>
                    <!--<select-option :disabled='!info.supportAppleLoan' value='1' text='苹果贷'></select-option>-->
                    <div class="footer-button">
                        <div class="button mid warn" v-if='btnInfo.giveup' @click='userReject'>客户放弃申请</div>
                        <div class="button mid error" v-if='btnInfo.reject' @click='reject'>审核拒绝</div>
                        
                        <div class="button mid success" 
                            v-if='btnInfo.pass'
                            @click='show_modal_pass = true' 
                            :class='{disabled : (type == 1 && !info.report.hasIcould) || (info.report.icloudMsgShow && !isSetPwd && type == 1) || !type || (type == 2 && !records.length)}'>审核通过</div>
                        <div class="button mid info" v-if='btnInfo.remarkZfb' @click='show_modal_remark_zfb = true'>登记线下放款账号</div>
                    </div>
                </div>
            </transition>
        </div>

        <confirm
            :show='show_confirm_unbind'
            title="确认解绑iCloud"
            :loading='loading_confirm'
            @close='show_confirm_unbind=false'
            @confirm='unbind'>
        </confirm>

        <confirm
            :show='show_confirm_delay_bind'
            title="确认延迟绑定iCloud"
            :loading='loading_confirm'
            @close='show_confirm_delay_bind=false'
            @confirm='delayBind'>
        </confirm>

        <modal 
            title='登记线下放款账号'
            :show='show_modal_remark_zfb' 
            :loading='loading_confirm' 
            @close='show_modal_remark_zfb = false'
            @confirm='remarkZfb'>
            <div class="modal-form-wrap">
                <ul class="modal-form">
                    <li class='form-item'>
                        <span class="form-item__key">线下放款账号</span>
                        <div class="form-item__value">
                            <input type="text" placeholder='请输入线下放款账号' v-model='alipay'>
                        </div>
                    </li>
                </ul>
            </div>
        </modal>

        <modal 
            title='录入新密码'
            :show='show_modal_icloud' 
            :loading='loading_set_icloud' 
            @close='show_modal_icloud = false'
            @confirm='setIcloudPwd'>
            <div class="modal-form-wrap">
                <ul class="modal-form">
                    <li class='form-item'>
                        <span class="form-item__key">新密码</span>
                        <div class="form-item__value">
                            <input type="text" placeholder='请输入新密码' v-model='icloudPwd'>
                        </div>
                    </li>
                    <li class='form-item'>
                        <span class="form-item__key">确认新密码</span>
                        <div class="form-item__value">
                            <input type="text" placeholder='请再次输入新密码' v-model='icloudRePwd'>
                        </div>
                    </li>
                </ul>
            </div>
        </modal>

        <modal  
            :show='show_modal_reject' 
            :title='rejectTitle'
            :loading='loading_reject'
            @confirm='rejectHandle'
            @close='show_modal_reject=false'>
            <ul class='modal-form'>
                <li class='form-item'>
                    <span class="form-item__key">iCloud状态</span>
                    <select-group 
                        v-model='icloudHasBind' 
                        placeholder='添加原因标签' 
                        key='icloudBind'>
                        <select-option  value='0' text='已解绑'></select-option>
                        <select-option  value='0' text='未绑定'></select-option>
                        <select-option  value='1' text='已绑定'></select-option>
                    </select-group>
                </li>                
                <li class='form-item'>
                    <span class="form-item__key">原因标签</span>
                    <select-group 
                        v-model='reasonTag' 
                        placeholder='添加原因标签（多选）' 
                        multiple 
                        key='userTag'
                        v-if='rejectType == "user"'>
                        <select-option  value='没需求了' text='没需求了'></select-option>
                        <select-option  value='不能接受绑定icloud的方式' text='不能接受绑定icloud的方式'></select-option>
                        <select-option  value='周期短' text='周期短'></select-option>
                        <select-option  value='利息高' text='利息高'></select-option>
                        <select-option  value='金额小' text='金额小'></select-option>
                    </select-group>
                    <select-group 
                        v-model='reasonTag' 
                        placeholder='添加原因标签（多选）' 
                        multiple 
                        key='rejectTag'
                        v-if='rejectType == ""'>
                        <select-option  value='电话三次不通' text='电话三次不通'></select-option>
                        <select-option  value='申请机型与绑定机型不匹配' text='申请机型与绑定机型不匹配'></select-option>
                        <select-option  value='此iPhone上已激活了最大数目的免费账户' text='此iPhone上已激活了最大数目的免费账户'></select-option>
                    </select-group>
                </li>
                <template v-if='rejectType != "user"'>
                    <li class='form-item'>
                        <span class="form-item__key red">上报风控数据中心</span>
                        <div class="form-item__value">
                            <radio-group v-model='isUpload'>
                                <radio :value='1'>是</radio>
                                <radio :value='0'>否</radio>
                            </radio-group>
                        </div>
                    </li>
                    <template v-if='isUpload'>
                        <li class='form-item'>
                            <span class="form-item__key">设备账户名</span>
                            <div class="form-item__value">
                                <input type="text" placeholder='请输入设备账户名' v-model='deviceAccount'>
                            </div>
                        </li>
                        <li class='form-item'>
                            <span class="form-item__key">设备序列号</span>
                            <div class="form-item__value">
                                <input type="text" placeholder='请输入设备序列号' v-model='serialNumber'>
                            </div>
                        </li>
                        <li class='form-item'>
                            <span class="form-item__key">IMEI</span>
                            <div class="form-item__value">
                                <input type="text" placeholder='请输入IMEI' v-model='imei'>
                            </div>
                        </li>
                    </template>
                </template>
            </ul>
            <textarea class='modal__textarea' rows="5" :placeholder="rejectPlaceholder" v-model='rejectReason'></textarea>
        </modal>

        <modal  
            :show='show_modal_pass' 
            title='审核通过'
            :loading='loading_pass'
            @confirm='passHandle'
            @close='show_modal_pass=false'>
            <div class="modal-form-wrap">
                <ul class='modal-form'>
                    <li class='form-item'>
                        <span class="form-item__key">放款金额</span>
                        <div class="form-item__value">
                            <input type="text" placeholder="请输入放款金额" v-model='amount'>
                        </div>
                    </li>
                    <li class='form-item'>
                        <span class="form-item__key">借款周期</span>
                        <div class="form-item__value" v-if='supportCycles.length'>
                            <select-group v-model='supportCycle'>
                                <select-option value='' text='请选择周期'></select-option>
                                <select-option 
                                    v-for='item in supportCycles' 
                                    :key='item.id' 
                                    :value='item.id' 
                                    :text='item.days + "天"' 
                                    v-if='item.status'></select-option>
                            </select-group>
                        </div>
                    </li>
                    <li class='form-item'>
                        <span class="form-item__key">服务费</span>
                        <div class="form-item__value">
                            <p class="item">{{ (amount * loanInfo.serviceCharge / 10) | toYuan}}</p>
                        </div>
                    </li>
                    <li class='form-item'>
                        <span class="form-item__key">到账金额</span>
                        <div class="form-item__value">
                            <p class="item" v-show='!amount'>--元</p>
                            <p class="item" v-show='amount'>{{(amountToFen - (amount * loanInfo.serviceCharge / 10)) | toYuan}}元</p>
                        </div>
                    </li>
                    <li class='form-item'>
                        <span class="form-item__key">到期应还</span>
                        <div class="form-item__value">
                            <p class="item">{{amount}}元</p>
                        </div>
                    </li>
                    <template v-if='type != 2'>
                        <li class='form-item'>
                            <span class="form-item__key">设备账户名</span>
                            <div class="form-item__value">
                                <input type="text" placeholder="请输入设备账户名" v-model='deviceAccount'>
                            </div>
                        </li>
                        <li class='form-item'>
                            <span class="form-item__key">序列号</span>
                            <div class="form-item__value">
                                <input type="text" placeholder="请输入序列号" v-model='seriaNumber'>
                            </div>
                        </li>
                        <li class='form-item'>
                            <span class="form-item__key">IMEI</span>
                            <div class="form-item__value">
                                <input type="text" placeholder="请输入手机IMEI" v-model='imei'>
                            </div>
                        </li>
                    </template>
                    <li class='form-item'>
                        <span class="form-item__key">设备型号</span>
                        <div class="form-item__value">
                            <select-group v-model='deviceModel' v-if='allModels.length' fixed :max-height='180'>
                                <select-option v-for='item in allModels' :key='item.id' :value='item.id' :text='item.model' v-if='item.status'></select-option>
                            </select-group>
                        </div>
                    </li>
                </ul>
            </div>
        </modal>
        <modal  
            :show='show_modal_lendlist' 
            title='借款记录'
            width='80%'
            confirm-text=''
            cancle-text='关闭'
            @close='show_modal_lendlist=false'>
            <div class="table-list" v-if='basicInfo.lendList && basicInfo.lendList.length'>
                <table>
                    <thead class="table-list__head">
                        <tr>
                            <th>借款编号</th>
                            <th>借款人</th>
                            <th>借款金额</th>
                            <th>借款周期</th>
                            <th>认证时间</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody class='table-list__body have-border'>
                        <tr v-for='item in basicInfo.lendList'>
                            <td>{{ item.lendCode || placeholder }}</td>
                            <td>{{ item.name || placeholder }}</td>
                            <td>{{ item.lendAmount | toYuan }}元</td>
                            <td>{{ item.lendCycle || placeholder }}天</td>
                            <td>{{ item.operatorTime | dateFormat }}</td>
                            <td>
                                <div class='option-box'>
                                    <span class='option-button' @click='goDetail(item.id)'>查看详情</span>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </modal>
    </div>
</template>

<script>
    import { Promise } from 'es6-promise'
    import footerBar from '../components/FooterBar.vue'
    import selectGroup from '../components/SelectGroup.vue'
    import selectOption from '../components/SelectOption.vue'
    import radioGroup from '../components/RadioGroup.vue'
    import datePicker from '../components/DatePicker.vue'
    import areaSelect from '../components/AreaSelect.vue'
    import radio from '../components/Radio.vue'
    import loading from '../components/Loading.vue'
    import tabBox from '../components/TabBox.vue'
    import tab from '../components/Tab.vue'
    import checkBox from '../components/CheckBox.vue'
    import toolTip from '../components/ToolTip.vue'
    import modal from '../components/Modal.vue'
    import confirm from '../components/Confirm.vue'
    import buttonLoading from '../components/ButtonLoading.vue'
    import pagination from '../components/Pagination.vue'
    import dateFormat from '../filters/filter-dateFormat'
    import toYuan from '../filters/filter-toYuan'
    import toPercent from '../filters/filter-toPercent'
    import  { mapGetters, mapActions }  from 'vuex'
    import { authApplyDetailValidation } from '../validation/validation'
    import Storage from '../utils/storage'
    import { icloudApi, systemApi, loanApi, authApi, allApi, lenderApi } from '../api/api'
    import moment from 'moment'


    export default {
        components:{
            footerBar,
            selectGroup,
            selectOption,
            radioGroup,
            tabBox,
            tab,
            radio,
            checkBox,
            areaSelect,
            loading,
            toolTip,
            modal,
            confirm,
            buttonLoading,
            pagination,
            datePicker
        },
        filters:{
            dateFormat,
            toYuan,
            toPercent,
            booleanToStr(boolean){
                if(boolean === true){
                    return '是'
                }
                else{
                    return '否'
                }
            }
        },
        data() {
            return {
                id:this.$route.params.id,
                placeholder:'--',
                type:'',
                remarks:'',
                isUpload:1,
                deviceAccount:'',
                show_modal_reject:false,
                show_modal_remark_zfb:false,
                show_modal_icloud:false,
                show_modal_pass:false,
                show_modal_lendlist:false,
                show_confirm_unbind:false,
                show_confirm_delay_bind:false,
                loading_confirm:false,
                loading_reject:false,
                loading_icloud:false,
                loading_set_icloud:false,
                loading_remarks:false,
                loading_pass:false,
                loading_contact:false,
                loading:false,
                amount:'',
                recommend:0,
                curItem:{},
                info:{},
                alipay:'',
                allModels:[],
                deviceModel:{
                    value:'',
                    text:'请选择手机型号'
                },
                icloudHasBind:{
                    value:'',
                    text:'请选择iCloud状态'
                },
                reasonTag:[],
                icloudPwd:'',
                icloudRePwd:'',
                isSetPwd:'',
                supportCycles:[],
                supportCycle:{
                    value:'',
                    text:'请选择周期'
                },
                listInfo:{},
                serialNumber:'',
                records:[],
                imei:'',
                seriaNumber:'',
                rejectReason:'',
                rejectTitle:'',
                rejectPlaceholder:'',
                rejectType:'',
                basicStatus:'',
                idCardStatus:'',
                mobileStatus:'',
                contactStatus:'',
                placeholder1:"",
            }
        },
        computed:{
            ...mapGetters([
                'msgTip',
                'localInfo'
            ]),
            amountToFen(){
                return (this.amount * 100).toFixed(0)
            },
            currentPage(){
                if(_.isEmpty(this.listInfo)) return 1
                return this.listInfo.pageNum
            },
            allAuth(){
                let basicPass = this.basicStatus === 0
                let idCardPass = this.idCardStatus === 0
                let mobilePass = this.mobileStatus === 0
                let contactPass = this.contactStatus === 0

                if(basicPass && idCardPass && mobilePass && contactPass) return true

                return false
            },
            report(){
                return this.info && this.info.report || {}
            },
            basicInfo(){
                return this.info.report && this.info.report.basicInfo || {}
            },
            loanInfo(){
                return this.info.report && this.info.report.loanInfo || {}
            },
            lendInfo(){
                return this.info.report && this.info.report.lendInfo || {}
            },
            btnInfo(){
                return this.info.report && this.info.report.btnInfo || {}
            },
            contactInfo(){
                return this.info.report && this.info.report.contactInfo || {}
            },
            icouldInfo(){
                return this.info.report && this.info.report.icloudInfo || {}
            },
            icloudDeviceInfo(){
                return this.icouldInfo && this.icouldInfo.deviceInfo || {}
            },
            reasonStr(){
                let text = ''
                _.each(this.reasonTag,(value,index)=>{
                    text = `${text}${value.value}##`
                })
                if(!this.rejectReason){
                    return text
                }
                else{
                    text = `${text}${this.rejectReason}##`
                }
                return text

            },
        },
        methods:{
            // actions
            ...mapActions([
                'showLoading',
                'hideLoading',
                'setMsgTip'
            ]),

            // filters
            timestampToDate(timestamp){
                if(!timestamp) return this.placeholder
                return moment(timestamp).format('YYYY-MM-DD')
            },

            // function
            goDetail(id){
                this.$router.push({
                    name:'finance-detail',
                    params:{
                        id:id
                    }
                })
            },
            userReject(){
                this.reasonTag.splice(0)
                this.rejectType = 'user'
                this.rejectTitle = '客户放弃申请'
                this.rejectPlaceholder = '请输入客户放弃申请原因'
                this.show_modal_reject = true
            },
            reject(){
                this.reasonTag.splice(0)
                this.rejectType = ''
                this.rejectTitle = '审核拒绝'
                this.rejectPlaceholder = '请输入审核拒绝原因'
                this.show_modal_reject = true
            },
            getIcloud(){
                this.loading_icloud = true
                loanApi.useICouldAccount({
                    id:this.id
                })
                .then(result=>{

                    this.getInfo()
                    this.loading_icloud = false
                })
                .catch(error => {
                    console.error(error)
                    this.loading_icloud = false
                })
            },
            getContact(){
                this.loading_contact = true
                loanApi.sendGetContactMessage({
                    id:this.id
                })
                .then(result=>{
                    this.getInfo()
                    this.loading_contact = false
                })
                .catch(error => {
                    console.error(error)
                    this.loading_contact = false
                })
            },
           /* reGetContact(){
                this.loading_contact = true
                loanApi.reUploadContact({
                    id:this.id
                })
                .then(result=>{
                    this.setMsgTip({
                        text:'再次获取通讯录成功',
                        type:'success'
                    })
                    this.getInfo()
                    this.loading_contact = false
                })
                .catch(error => {
                    console.error(error)
                    this.loading_contact = false
                })
            },*/
            getContactList(num = 1){
                this.loading_contact = true
                loanApi.getContact({
                    id:this.id,
                    pageSize:10,
                    pageIndex:num,
                })
                .then(result=>{
                    this.listInfo = result
                    this.records = result.records
                    if(result.totalPage < result.pageNum){
                        this.getList(result.totalPage)
                    }
                    this.loading_contact = false
                })
                .catch(error => {
                    console.error(error)
                    this.loading_contact = false
                })
            },
            addRemarks(){
                this.loading_remarks = true
                loanApi.addRemarks({
                    id:this.id,
                    remarks:this.remarks
                })
                .then(result=>{
                    this.setMsgTip({
                        text:'提交备注成功',
                        type:'success'
                    })
                    this.loading_remarks = false
                })
                .catch(error => {
                    console.error(error)
                    this.loading_remarks = false
                })
            },
            setIcloudPwd(){
                if(!this.icloudPwd){
                    this.setMsgTip({
                        text:'请输入密码',
                        type:'warn'
                    })
                    return
                }
                if(this.icloudPwd != this.icloudRePwd){
                    this.setMsgTip({
                        text:'两次输入的密码不一致',
                        type:'warn'
                    })
                    return
                }
                if(this.icloudPwd == this.icouldInfo.emailPwd){
                    this.setMsgTip({
                        text:'新密码不能与旧密码相同',
                        type:'warn'
                    })
                    return
                }
                this.loading_set_icloud = true
                icloudApi.resetPwd({
                    id:this.icouldInfo.id,
                    newPwd:this.icloudPwd
                })
                .then(result=>{
                    this.show_modal_icloud = false
                    this.loading_set_icloud = false
                    Storage.set(`shoujidai_${this.icouldInfo.id}_pwd`,true)
                    this.isSetPwd = true
                    this.getInfo()
                })
                .catch(error => {
                    console.error(error)
                    this.loading_set_icloud = false
                })
            },  
            getInfo(){
                this.loading = true
                loanApi.detail({
                    id:this.id
                })
                .then(result=>{
                    this.info = result
                    this.remarks = result.remarks
                    this.isSetPwd = Storage.get(`shoujidai_${this.icouldInfo.id}_pwd`) || false
                    if(result.status != "WAITCHECK"){
                        Storage.set(`shoujidai_${this.icouldInfo.id}_pwd`,false)
                        this.isSetPwd = false
                    }
                    this.type = 2
                    this.placeholder1="现金贷"
                    if(result.report.contactInfo.hasContact === 1){
                        this.getContactList()
                    }
                    
                    /*if(result.supportAppleLoan && !result.supportCashLoan){
                        this.type = 1
                    }
                    if(!result.supportAppleLoan && result.supportCashLoan){
                        this.type = 2
                    }*/

                    
                    
                    this.loading = false
                })
                .catch(error => {
                    console.error(error)
                    this.loading = false
                })
            },
            getCycles(){
                systemApi.allCycles()
                .then(result=>{
                    this.supportCycles = result
                })
                .catch(error => {
                    console.error(error)
                })
            },
            getAllModels(){
                systemApi.allModels()
                .then(result=>{
                    this.allModels = result
                })
                .catch(error => {
                    console.error(error)
                })
            },
            unbind(){
                this.loading_confirm = true
                loanApi.unbindIcloud({
                    id:this.id
                })
                .then(result=>{
                    this.loading_confirm = false
                    this.show_confirm_unbind = false
                    this.getInfo()
                })
                .catch(error => {
                    console.error(error)
                    this.loading_confirm = false
                })
            },
            delayBind(){
                this.loading_confirm = true
                loanApi.delayBindIcloud({
                    id:this.id
                })
                .then(result=>{
                    this.loading_confirm = false
                    this.show_confirm_unbind = false
                    this.setMsgTip({
                        text:`最后确认时间为${dateFormat(result)}`,
                        type:'success'
                    })
                    this.getInfo()
                })
                .catch(error => {
                    console.error(error)
                    this.loading_confirm = false
                })
            },
            remarkZfb(){
                this.loading_confirm = true
                loanApi.remarkZfbNo({
                    id:this.id,
                    zfbNo:this.alipay
                })
                .then(result=>{
                    this.loading_confirm = false
                    this.show_modal_remark_zfb = false
                    this.getInfo()
                })
                .catch(error => {
                    console.error(error)
                    this.loading_confirm = false
                })
            },
            passHandle(){

                if(!this.amount){
                    this.setMsgTip({
                        text:'请输入放款金额原因',
                        type:'warn'
                    })
                    return
                }
                if(this.supportCycle.value === ''){
                    this.setMsgTip({
                        text:'请选择借款周期',
                        type:'warn'
                    })
                    return
                }
                if(this.type == 1){
                    if(this.seriaNumber === ''){
                        this.setMsgTip({
                            text:'请输入序列号',
                            type:'warn'
                        })
                        return
                    }
                    if(this.imei === ''){
                        this.setMsgTip({
                            text:'请输入手机IMEI',
                            type:'warn'
                        })
                        return
                    }
                    if(this.deviceModel.value === ''){
                        this.setMsgTip({
                            text:'请选择手机型号',
                            type:'warn'
                        })
                        return
                    }
                }

                this.loading_pass = true
                loanApi.pass({
                    id:this.id,
                    deviceAccount:this.deviceAccount,
                    lendAmount:this.amountToFen,
                    cycleId:this.supportCycle.value,
                    seriaNumber:this.seriaNumber,
                    imei:this.imei,
                    deviceModel:this.deviceModel.text,
                    loanLendType:this.type
                })
                .then(result=>{
                    this.loading_pass = false
                    this.show_modal_pass = false
                    Storage.set(`shoujidai_${this.icouldInfo.id}_pwd`,false)
                    this.$router.back()
                })
                .catch(error => {
                    console.error(error)
                    this.loading_pass = false
                })
            },
            rejectHandle(){

                if(!this.reasonStr){
                    this.setMsgTip({
                        text:'请输入原因或选择至少一个原因标签',
                        type:'warn'
                    })
                    return
                }
                if(this.icloudHasBind.value === ''){
                    this.setMsgTip({
                        text:'请选择icloud状态',
                        type:'warn'
                    })
                    return
                }
                this.loading_reject = true
                if(this.rejectType == 'user'){
                    loanApi.userReject({
                        id:this.id,
                        rejectReason:this.reasonStr,
                        hasBind:this.icloudHasBind.value
                    })
                    .then(result=>{
                        this.loading_reject = false
                        this.show_modal_reject = false
                        this.$router.back()
                    })
                    .catch(error => {
                        console.error(error)
                        this.loading_reject = false
                    })
                    return
                }
                loanApi.reject({
                    id:this.id,
                    rejectReason:this.reasonStr,
                    hasBind:this.icloudHasBind.value,
                    isUpload:this.isUpload,
                    seriaNumber:this.serialNumber,
                    imei:this.imei,
                    deviceAccount:this.deviceAccount,
                })
                .then(result=>{
                    this.loading_reject = false
                    this.show_modal_reject = false
                    this.$router.back()
                })
                .catch(error => {
                    console.error(error)
                    this.loading_reject = false
                })
            }
        },
        created(){
            this.getCycles()
            this.getInfo()
            this.getAllModels()
        }
    }
</script>

<style lang="scss">
    @import "../sass/variables";
    @import "../sass/extends";
    @import "../sass/mixins";

    #loan-apply-detail{
        .footer-button{
            padding-top: 50px;
            display: flex;
            justify-content: center;
            .component-select-box{
                width: 160px;
                margin: 0 20px;
            }
            .button{
                margin:0 20px;
            }
        }
        .detail-info{
            font-size: 14px;
            line-height: 1.5;
            padding-top:10px;
            color:$importColor;
            p{
                padding-top: 10px;
            }
            span{
                font-weight: normal;
            }
        }
        .new-pwd{
            display: inline-block;
            padding-left: 10px;
        }
        .button-add-remarks{
            margin-top: 15px;
        }
    }
</style>
